import React, {Component} from 'react';
import {ListView, Text, View, Button, Alert, TouchableOpacity, Image, DatePickerAndroid, Platform} from 'react-native';
import chjStyle from '../../../CustomStyle';

export default class CommonCheckItem extends React.Component
{
  constructor(props)
  {
    super(props);
    this.state = {
      checked:this.props.object.checked
    };
  }

  render() {
    var iconSource = this.state.checked ? require('../../../../img/ok.png') : require('../../../../img/okNo.png');
    return (
        <TouchableOpacity
        style={[chjStyle.textItem]}
        onPress={this.onPress.bind(this)}>
          <Text style={{
            position:'absolute',
            color:'#303030',
            textAlign: 'left',
            backgroundColor: 'rgba(0, 0, 0, 0)',
            fontSize: chjStyle.getActualFontSize(30),
            top: chjStyle.getActualSizeInVertical(40),
            left: chjStyle.getActualSizeInHorizontal(40),
            width: chjStyle.width,
          }}>{this.props.object.name}</Text>
          <Image
            source={iconSource}
            style={{
            position:'absolute',
            resizeMode:'contain',
            top: chjStyle.getActualSizeInVertical(32),
            right: chjStyle.getActualSizeInHorizontal(30),
            width: chjStyle.getActualSizeInHorizontal(64),
            height: chjStyle.getActualSizeInVertical(64)
          }}/>
        </TouchableOpacity>
    );
  }

  onPress(){
    var newStatus = !this.state.checked;
    this.setState({
      checked:newStatus
    });
    this.props.onValueChangedListener(newStatus);
  }
}
